<template>
	<view class="page-wrap">
		<view class="set-plate">
			<view class="set-plate-title">
				行情相关
			</view>
			<uni-list>
				<uni-list-item>
					<template v-slot:header>
						<view class="menu-key">
							日期
						</view>
					</template>
					<template v-slot:footer>
						<switch style="transform: scale(.8);" :checked="isTime" color="#EE5953" @change="switch1Change" />
					</template>
				</uni-list-item>
				<uni-list-item>
					<template v-slot:header>
						<view class="menu-key">
							持仓合约自动添加自选
						</view>
					</template>
					<template v-slot:footer>
						<switch style="transform: scale(.8);" :checked="isTime" color="#EE5953" @change="switch1Change" />
					</template>
				</uni-list-item>
				<uni-list-item>
					<template v-slot:header>
						<view class="menu-key">
							自选持仓合约标记颜色
						</view>
					</template>
					<template v-slot:footer>
						<switch style="transform: scale(.8);" :checked="isTime" color="#EE5953" @change="switch1Change" />
					</template>
				</uni-list-item>
				<uni-list-item showArrow title="自选持仓合约标记颜色" to="/pages/transaction/chart-display/chart-display" />
			</uni-list>
		</view>
		
		<view class="set-plate">
			<view class="set-plate-title">
				下单设置
			</view>
			<uni-list>
				<uni-list-item showArrow title="交易委托确认" />
				<uni-list-item showArrow title="下单默认手数" />
				<uni-list-item showArrow title="反手默认委托价" />
				<uni-list-item showArrow title="超价参数设置" />
				<uni-list-item showArrow title="交易提醒设置" />
				<uni-list-item showArrow title="闪电下单模式" />
			</uni-list>
		</view>
		
		<view class="set-plate">
			<view class="set-plate-title">
				个性化设置
			</view>
			<uni-list>
				<uni-list-item>
					<template v-slot:header>
						<view class="menu-key">
							登录账户直接进入持仓列表
						</view>
					</template>
					<template v-slot:footer>
						<switch style="transform: scale(.8);" :checked="isTime" color="#EE5953" @change="switch1Change" />
					</template>
				</uni-list-item>
				<uni-list-item>
					<template v-slot:header>
						<view class="menu-key">
							资金显示市值权益
						</view>
					</template>
					<template v-slot:footer>
						<switch style="transform: scale(.8);" :checked="isTime" color="#EE5953" @change="switch1Change" />
					</template>
				</uni-list-item>
			</uni-list>
		</view>
		
		<view class="set-plate">
			<view class="set-plate-title">
				条件单设置
			</view>
			<uni-list>
				<uni-list-item>
					<template v-slot:header>
						<view class="menu-key">
							条件单创建确认
						</view>
					</template>
					<template v-slot:footer>
						<switch style="transform: scale(.8);" :checked="isTime" color="#EE5953" @change="switch1Change" />
					</template>
				</uni-list-item>
				<uni-list-item>
					<template v-slot:header>
						<view class="menu-key">
							清仓自动删除损盈单
						</view>
					</template>
					<template v-slot:footer>
						<switch style="transform: scale(.8);" :checked="isTime" color="#EE5953" @change="switch1Change" />
					</template>
				</uni-list-item>
				<uni-list-item showArrow title="止损参数设置" />
				<uni-list-item showArrow title="条件单参数设置" />
			</uni-list>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isTime: true
			}
		},
		methods: {
			switch1Change(val) {
				console.log(val)
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #F5F5F5;
	}
	.page-wrap {
		padding-bottom: 200rpx;
	}
	.set-plate {
		width: 686rpx;
		box-sizing: border-box;
		margin: 0 auto;
		.set-plate-title {
			font-size: 24rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: rgba(0,0,0,0.8);
			margin: 26rpx 0;
		}
		.uni-list {
			background: #FFFFFF;
			border-radius: 16rpx;
			overflow: hidden;
			& /deep/ .uni-list-item__container {
				height: 104rpx;
				box-sizing: border-box;
				align-items: center;	
			}
			& /deep/ .uni-list-item__content-title,
			.menu-key {
				font-size: 28rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				color: rgba(0,0,0,0.8);
			}
		}
	}
</style>